<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Document</title>
		<link rel="stylesheet" type="text/css" href="bootstrap.min.css" />
	</head>

	<body>
		<!-- 页头 -->
		<header>
			<nav class="navbar navbar-expand-sm navbar-light bg-light">
				<a href="" class="navbar-brand">资讯网</a>
				<ul class="navbar-nav mr-auto">
					<li class="nav-item active">
						<a href="" class="nav-link active">首页</a>
					</li>
					<li class="nav-item">
						<a href="" class="nav-link">个人中心</a>
					</li>
					<li class="nav-item">
						<a href="" class="nav-link">欢迎xxx用户</a>
					</li>
					<li class="nav-item">
						<a href="" class="nav-link">帮助</a>
					</li>
				</ul>
			</nav>
		</header>
		<!-- 主体 -->
		<article class="jumbotron">
			<div class="container" align="center">
				<div class="col-6 card p-5">
					<!-- 标题栏 -->
					<div class="bg-secondary p-2" align="center">
						<h4>账号注册</h4>
					</div>
					<!-- 表单 -->
					<form action="" role="form">
						<!-- 用户名的输入 -->
						<div class="input-group mt-3">
							<div class="input-group-prepend">
								<span class="input-group-text">用户名</span>
							</div>
							<input type="text" placeholder="请输入用户名" class="form-control" />
						</div>
						<!-- 密码 -->
						<div class="input-group mt-3">
							<div class="input-group-prepend">
								<span class="input-group-text">密码</span>
							</div>
							<input type="password" placeholder="请输入密码" class="form-control" />
						</div>
						<!-- 确认密码 -->
						<div class="input-group mt-3">
							<div class="input-group-prepend">
								<span class="input-group-text">确认密码</span>
							</div>
							<input type="text" placeholder="请输入密码" class="form-control" />
						</div>
						<!-- 城市 -->
						<div class="input-group mt-3">
							<div class="input-group-prepend">
								<span class="input-group-text">城市</span>
							</div>
							<select class="form-control">
								<option value ="0">aa</option>
								<option value ="1">bb</option>
								<option value ="2">cc</option>
								<option value ="3">dd</option>
								<option value ="4">ee</option>
							</select>
						</div>
						<!-- 注册按钮 -->
						<button type="button" class="btn btn-success mt-3 w-100">注册</button>
					</form>
				</div>
			</div>
		</article>
		<!-- 页尾 -->
		<footer class="jumbotron">
			<h5 class="text-muted" align="center">Copyright© xxx公司 版权所有</h5>
		</footer>
	</body>

</html>
